import axios from 'axios'
import { getToken } from './auth'
import store from '@/store'
import router from '@/router'
// 知识点：在js文件里面单独使用element ui 的组件，按需引入直接使用即可，等同于$this.message
import { Message } from 'element-ui'
const service = axios.create({
  baseURL: 'https://api-hmzs.itheima.net/v1',
  timeout: 5000 // request timeout
})

// 请求拦截器
service.interceptors.request.use(
  config => {
    const token = getToken()
    config.headers.Authorization = token
    return config
  },
  error => {
    return Promise.reject(error)
  }
)

// 响应拦截器
service.interceptors.response.use(
  response => {
    return response.data
  },
  error => {
    if (error.status === 401) {
      // token过期，清空
      store.commit('user/removeToken')
      router.push('/login')
    }

    if (error.response) Message.error(error.response.data.msg)
    // 知识点：返回一个状态为reject的promise对象， 代表抛出错误，在组件内通过catch可以捕获到这个错误信息
    // 这句话也可以在请求拦截器写，看需求
    return Promise.reject(error)
  }
)

export default service
